<template>
	<view class="container">
		<view class="status_bar" style="height: var(--status-bar-height); width: 100%;"></view>
		
		<nav-bar fixed :title="title" />

		<uni-list v-if="list.length > 0">
			<uni-list-item
				v-for="(item, index) in list"
				:key="index"
				show-arrow
				clickable
				@tap="itemClick(item)"
			>
				<template v-slot:header>
					<view class="slot-box">
						<image class="slot-image" :src="item.avatar" @error="imageError(e, item)" />
					</view>
				</template>
				<template v-slot:body>
					<text class="slot-box slot-text">
						{{ item.userName ? item.userName : item.label }}
					</text>
				</template>
			</uni-list-item>
		</uni-list>
		<view v-else class="no-data">暂无数据</view>
	</view>
</template>

<script setup>
import { ref } from 'vue'
import { onLoad } from '@dcloudio/uni-app'
import { getUserByDept, getUsersByName } from '@/net/dangyuanguanli'
import NavBar from '../../components/nav-bar.vue'

const title = ref('')
const list = ref([])
onLoad(async params => {
	title.value = params.title
	let res
	if (params.id) {
		res = await getUserByDept({ djDeptId: params.id })
	} else {
		res = await getUsersByName({ djUserName: params.keyword })
	}
	list.value = res.data
})

const itemClick = item => {
	if (item.userName) {
		// 点击党员
		const { djUserId } = item
		uni.navigateTo({ url: `./userInfo?id=${djUserId}` })
	} else {
		// 点击党组织
		const { id, label } = item
		uni.navigateTo({ url: `./addressList?id=${id}&title=${label}` })
	}
}

const imageError = (e, item) => {
	item.avatar = '/static/avatar.png'
}

const back = () => {
	uni.navigateBack({ delta: 1 })
}
</script>

<style lang="scss" scoped>
@import '/static/common.scss';
page {
	height: 100%;
	display: flex;
}
.container {
	flex: 1;
}
</style>
